!(function($){
	$.fn.slider = function(options){
		$(this).each(function(){
			slide.defaults.node = $(this);
			var a = new slide(options,slide.defaults);
		});
	};
	slide.defaults = {
		height: 3,
		bgColor: '#16aad8',
		position: "bottom",
		boxNumColor: '#16aad8'
	};
	function slide(options,defaults){
		var opts = $.extend({},defaults, options);
		opts.pnode = opts.node.parent();
		this.create(opts);
		this.bindEvent(opts);
	};
	slide.prototype = {
		create:function(opts){
			opts.anode = $('.active',opts.pnode);
			opts.node.css({
				'width':this.setWidth(opts),
				'height':opts.height,
				'background':opts.bgColor,
				'left':this.getOffsetLeft(opts)
			});
			switch(opts.position){
				case "bottom" : opts.node.css('bottom',0);break;
				case "top" : opts.node.css('top',0);break;
				case "box" : this.box(opts);break;
			}
		},
		bindEvent:function(opts){
			var opts = opts,_this = this;
			$('li',opts.pnode).bind('click',function(e){
				e||e.stopPropagation()?e.stopPropagation():window.event.cancelBubble=true;
				$(this).addClass('active').siblings('li').removeClass('active');
				opts.anode = $(this);
				opts.position=="box"?_this.box(opts):_this.setWidth(opts);
				opts.node.animate({'left':_this.getOffsetLeft(opts)},300);
			});
		},
		box:function(opts){
			opts.node.empty();
			opts.node.addClass('box');
			opts.height = opts.anode.outerHeight();
			opts.width = opts.anode.outerWidth();
			opts.text = $('span',opts.anode).clone();
			opts.bnode = $('b',opts.anode).clone();
			opts.node.css({'height':opts.height,'width':opts.width});
			this.getText(opts);
		},
		setWidth:function(opts){
			opts.width = opts.anode.width();
			opts.node.css('width',opts.width);
		},
		getText:function(opts){
			opts.node.append(opts.text);
			if(opts.bnode&&opts.bnode.length>0){
				opts.node.append(opts.bnode);
				opts.bnode.css({'background':opts.boxNumColor});
			}
		},
		getOffsetLeft:function(opts){
			var left = opts.anode.offset().left,
				_left = opts.pnode.offset().left,
				pdLeft = parseInt(opts.anode.css('paddingLeft'));
			if(opts.position == "box"){
				return left-_left;
			}else{
				return left-_left+pdLeft;
			}
		}
	};
})(jQuery);
$('.slider').slider({});